﻿@model SmallJob.Model.User
@{
    ViewBag.Title = Model.ProperName;
    ViewBag.UserName = Model.ProperName;
    ViewBag.Description = Model.ProperName;
    Layout = "~/Views/Shared/_Layout2.cshtml";
    var cul = System.Globalization.CultureInfo.GetCultureInfo("vi-VN");
    string coverUrl = !string.IsNullOrWhiteSpace(Model.CoverImage) ? "background-image: url(" + Model.CoverImage + ")" : "background-image: url(" + Url.Content("~/Content/img/default_cover.jpg") + ")";
    var isFbAcc = string.IsNullOrWhiteSpace(Model.FbID) ? false : true;
    var verified = SmallJob.Services.Code.UserUtility.GetVerifyAccount(Model.VerifyStatus).IsSameDone();
    var listFollowers = ViewData["listFollowers"] as List<SmallJob.Model.User>;
    var orders = ViewData["comment"] as List<SmallJob.Model.Order>;
    var requests = ViewData["requests"] as List<SmallJob.Model.Request>;
    var isowner = Convert.ToBoolean(ViewData["isOwner"]);
}
@section DifMetaData
{

}
@section FBMeta
{
    <meta property="fb:app_id" content="479862562081214" />
    <meta property="og:title" content="@Model.ProperName" />
    <meta property="og:image" content="http://viecnho.com/Content/img/logo-square.png" />
    <meta property="og:url" content="http://viecnho.com" />
    <meta property="og:type" content="viecnho:account" />
}
<div id="div-loading" style="display: none; position: absolute; background-color: white; opacity: 0.5; width: 1349px; height: 430px; z-index: 999; top: 40px; right: 0px;">
    <img src="@Url.Content("~/Content/img/350.gif")" style="margin: 199px 0 0 658px" />
</div>
<div class="user-profile">
    <div class="user-cover-default" id="div-cover" style="@coverUrl; filter: none">
        <div class="user-cover row-fluid">
            <div class="user-avatar" id="div-avatar">
                @if (string.IsNullOrWhiteSpace(Model.Avatar))
                {
                    <img id="avatar" src="@Url.Content("~/Content/img/blank-avatar.jpg")" />
                }
                else
                {
                    <img id="avatar" src="@Model.Avatar?w=180&h=180&q=90&format=jpg&mode=crop" />
                }
            </div>
            <h1 class="text-center">@Model.ProperName</h1>
            <h4 class="text-center user-about">@Model.Job - @Model.Location</h4>
            <p class="text-center">
                @if (!string.IsNullOrWhiteSpace(Model.FbID))
                {
                    <a href="http://facebook.com/@Model.FbID" target="_blank">
                        <img src="@Url.Content("~/Content/img/facebook_icon.png")" rel="tooltip" data-toggle="tooltip" data-placement="top" title="" data-original-title="Tài khoản đã xác thực Facebook" />
                    </a>
                }
                &nbsp;
                @if (verified)
                {
                    <img src="@Url.Content("~/Content/img/verified_account.png")" rel="tooltip" data-toggle="tooltip" data-placement="right" title="" data-original-title="Tài khoản đã xác thực" />
                }
            </p>
            @if (isowner)
            {
                <p class="text-center user-edit">
                    <a class="btn btn-small" id="p-avatar" href="javascript:;"><i class="icon-user"></i>&nbsp;Sửa Avatar</a>
                    <a class="btn btn-small" id="p-cover" href="javascript:;"><i class="icon-picture"></i>&nbsp;Sửa Cover</a>
                </p>
                using (Html.BeginForm("UploadCover", "User", FormMethod.Post, new { style = "display:none", id = "form-cover", enctype = "multipart/form-data" }))
                {
                <input style="visibility: hidden" id="coverImage" type="file" name="imageCover" />
                }
                using (Html.BeginForm("UploadAvatar", "User", FormMethod.Post, new { style = "display:none", id = "form-avatar", enctype = "multipart/form-data" }))
                {
                <input style="visibility: hidden" id="avatarImage" type="file" name="avatarImage" />
                }
            }
            else
            {
                if (User.Identity.IsAuthenticated)
                {
                    if (!Convert.ToBoolean(ViewData["isFollowwed"]))
                    {
                <p class="text-center user-edit">
                    <a class="btn btn-small"  onclick="follow(@Model.ID)" href="javascript:;"><i class="icon-star"></i>&nbsp;Quan Tâm</a>
                </p>
                    }
                    else
                    {
                <p class="text-center user-edit">
                    <a class="btn btn-small"  onclick="unfollow(@Model.ID)" href="javascript:;"><i class="icon-remove"></i>&nbsp;Bỏ Quan Tâm</a>
                </p>
                    }
                }
            }
        </div>
    </div>
</div>

<div class="user-services">
    <div class="container">
        <h4 class="user-reputation text-center" id="h4-follow"><i class="icon-thumbs-up user-icon"></i>&nbsp;@orders.Count đánh giá&nbsp;&nbsp;&nbsp;<i class="icon-heart user-icon"></i>&nbsp;@ViewData["countfollow"] người quan tâm</h4>

        <div class="row">
            @if (ViewData["services"] != null)
            {
                foreach (var item in ViewData["services"] as List<SmallJob.Model.Provide>)
                {
                    string[] image = item.ImagePath.Split(';');
                    string url = image[0] + "?w=368&h=228&q=90&format=jpg&mode=crop";

                <div class="span4">
                    <div class="service-box">
                        <div class="service-image">
                            <a href="@Url.Action("Details", "Provide", new { id = item.ID })">
                                <img src="@url" /></a>
                            @if (isowner)
                            {
                                <div class="service-edit-button"><a class="btn btn-small" href="/sua-dich-vu/@item.ID"><i class="icon-pencil"></i>&nbsp;Sửa dịch vụ</a></div>
                            }
                        </div>
                        <div class="service-description">
                            <div class="avatar">
                                <a href="@Url.Action("Index", "User", new { username = (string.IsNullOrWhiteSpace(Model.UserName) ? Model.ID.ToString() : Model.UserName) })">
                                    @if (string.IsNullOrWhiteSpace(Model.Avatar))
                                    {
                                        <img rel="tooltip" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="@Model.ProperName" src="@Url.Content("~/Content/img/blank-avatar.jpg")" />
                                    }
                                    else
                                    {
                                        <img rel="tooltip" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="@Model.ProperName" src="@Model.Avatar?w=40&h=40&q=90&format=jpg&mode=crop" />
                                    }
                                </a>
                            </div>
                            <div class="service-title">
                                <a href="@Url.Action("Details", "Provide", new { id = item.ID })">
                                    <h5>@item.Title</h5>
                                </a>
                            </div>
                            <div class="service-price">
                                @*@item.Price.ToString("#,###", cul.NumberFormat)  ₫*@
                                <a href="#" rel="tooltip" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="@item.Price.ToString("#,###", cul.NumberFormat)  VNĐ" style="text-decoration:none; color: #666;">@SmallJob.Services.Code.UserUtility.FormatCurrency(item.Price)</a>
                            </div>
                        </div>
                    </div>
                </div>
                }
                if (isowner)
                {
                <div class="span4" style="width:370px">
                    <a class="service-box-blank" href="/them-dich-vu">
                        <span class="service-add-button">
                            <button class="btn btn-small" href="/them-dich-vu"><i class="icon-plus"></i>&nbsp;Thêm dịch vụ</button></span>
                    </a>
                </div>
                }
            }
        </div>
    </div>
</div>

<div class="user-story">
    <div class="container">
        <div class="row-fluid">
            <div class="span7 user-box">
                @if (isowner)
                {
                    <span class="btn-edit" id="btn-edit" title="Sửa Thông Tin Cá Nhân"><i class="icon-edit"></i>&nbsp;Sửa</span>
                }
                <h3 id="gioi-thieu-ban-than">Giới thiệu bản thân</h3>
                <div class="user-story-about" id="div-info">
                    @if (String.IsNullOrWhiteSpace(Model.Info))
                    {
                        <p>Bạn làm nghề gì?</p>
                        <p>Kinh nghiệm làm việc của bạn như thế nào?</p>
                        <p>Bạn có kỹ năng gì đặc biệt?</p>
                        <p>Các sản phẩm mà bạn đã từng làm là gì?</p>
                        <p>Ấn nút edit để thay đổi thông tin để mọi người biết rõ hơn về bạn.</p>
                    }
                    else
                    {
                        @MvcHtmlString.Create(HttpUtility.HtmlDecode(Model.Info));
                    }
                </div>
            </div>
            <div class="span5 user-box">
                @if (isowner)
                {
                    <span class="btn-edit" id="btn-edit-skill" title="Thay đổi kỹ năng"><i class="icon-edit"></i>&nbsp;Sửa</span>
                }
                <h3 id="cac-ky-nang">Các kỹ năng</h3>
                <div id="div-skill">
                    @if (Model.Skill != null)
                    {
                        <p>@Model.Skill.Replace(",", ", ")</p>
                    }
                </div>
                @if (listFollowers != null && listFollowers.Count > 0)
                { 
                    <h3 id="nhung-nguoi-quan-tam">Những người quan tâm</h3>
                    <div class="service-description">
                        @foreach (var item in listFollowers)
                        {
                            <div class="avatar">
                                <a href="@Url.Action("Index", "User", new { username = (string.IsNullOrWhiteSpace(item.UserName) ? item.ID.ToString() : item.UserName) })">
                                    @if (string.IsNullOrWhiteSpace(item.Avatar))
                                    {
                                        <img rel="tooltip" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="@item.ProperName" src="@Url.Content("~/Content/img/blank-avatar.jpg")"/>
                                    }
                                    else
                                    {
                                        <img  rel="tooltip" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="@item.ProperName" src="@item.Avatar?w=40&h=40&q=90&format=jpg&mode=crop"/>
                                    }
                                </a>
                            </div>
                        }
                        <div style="clear: both"></div>
                    </div>
                }
                <h3 id="danh-gia-dich-vu">Đánh giá dịch vụ</h3>
                @foreach (var item in orders)
                {
                    <p><a href="/@(item.Buyer.UserName ?? item.Buyer.ID.ToString())">@item.Buyer.ProperName</a> đánh giá:</p>
                    <div class="rateit" data-rateit-value="@item.Rate" data-rateit-ispreset="true" data-rateit-readonly="true"></div>
                    <p><em>"@item.Comment"</em></p>
                }
                <h3 id="yeu-cau-da-dang">Yêu cầu đã đăng</h3>
                <ul>
                    @foreach (var item in requests)
                    {
                        <li id="request-container-@item.ID">
                            <a rel="tooltip" data-toggle="tooltip" data-placement="top" title="" data-original-title="@(SmallJob.Services.Code.UserUtility.ShortString(SmallJob.Services.Code.UserUtility.RemoveHtml(HttpUtility.HtmlDecode(item.Description)), "300"))" href="@Url.Action("Details", "Request", new { id = item.ID })">
                                @SmallJob.Services.Code.UserUtility.ShortString(item.Title, "70")

                            </a>
                            <div style="float: right;">
                                @if (isowner)
                                {
                                    <a href="@Url.Action("Add", "Request", new { id = item.ID })" target="_blank">Sửa</a>
                                    <a href="javascript:;" onclick="deletedrequest(this);" id="request-delete-@item.ID">Xóa</a>
                                }
                            </div>
                        </li>
                    }
                </ul>
            </div>
        </div>
    </div>
</div>
<script type="text/javascript">
    var currentText = '@(Model.Info != null ? HttpUtility.HtmlDecode(Model.Info).Replace("\n","&lt;br&gt;") : "")';
    $('#btn-edit').click(function () {
        $(this).hide();
        var curHTML = $('#div-info').html();
        $('#div-info').html('<div class="form-actions">'
                        + '<form method="post" action="@Url.Action("ChangeInfo", "User")" id="form-info">'
                        + '<textarea id="area-info" name="info" style="width:478px;height:400px">' + currentText + '</textarea>'
                        + '<button type="submit" class="btn btn-primary">Lưu thay đổi</button>&nbsp;'
                        + '<button type="button" id="btn-cancel" class="btn">Hủy</button>'
                        + '</form>'
                        + '</div>');
        $('#form-info').ajaxForm(function (data) {
            if (data == true) {
                $('#btn-edit').show();
                currentText = $('#area-info').val();
                $('#div-info').html($('#area-info').val());
            }
        });
        $('#area-info').wysihtml5({
            "font-styles": false
        });
        $('#btn-cancel').click(function () {
            $('#btn-edit').show();
            $('#div-info').html(curHTML);
        });
    });
    $('#p-cover').click(function () {
        document.getElementById('coverImage').click();
    });
    $('#p-avatar').click(function () {
        document.getElementById('avatarImage').click();
    });
    $('#coverImage').change(function () {
        if ($(this).val().length > 0) {
            $('#div-loading').show();
            $('#form-cover').ajaxForm(function (data) {
                if (data != null && data.length > 0 && data != 'smallimage') {
                    $('#div-cover').css('background-image', 'url(' + data + ')');
                    $('#div-loading').hide();
                    $('#coverImage').val('');
                } else {
                    if (data == 'smallimage') {
                        alert('Chiều rộng ảnh từ 1200pixel trở lên!');
                    }
                    $('#div-loading').hide();
                    $('#coverImage').val('');
                }
            });
            $('#form-cover').submit();
        }
    });
    $('#avatarImage').change(function () {
        if ($(this).val().length > 0) {
            $('#div-loading').show();
            $('#form-avatar').ajaxForm(function (data) {
                if (data != null && data.imagePath.length > 0 && data != 'smallimage') {
                    $('#avatar').attr('src', data.imagePath + '?w=180&h=180&q=90&format=jpg&mode=crop');
                    $('#div-loading').hide();
                    $('#avatarImage').val('');
                } else {
                    if (data == 'smallimage') {
                        alert('Chiều rộng ảnh từ 1200pixel trở lên!');
                    }
                    $('#div-loading').hide();
                    $('#avatarImage').val('');
                }
            });
            $('#form-avatar').submit();
        }
    });
    $('#btn-edit-skill').click(function () {
        var curHTML = $('#div-skill').html();
        $('#div-skill').html('<div class="form-actions">'
                        + '<form method="post" action="@Url.Action("ChangeSkills", "User")" id="form-skill">'
                        + '<ul id="tag-skills">'
                        + '</ul>'
                        + '<button type="submit" class="btn btn-primary">Lưu thay đổi</button>&nbsp;'
                        + '<button type="button" id="btn-cancel-skill" class="btn">Hủy</button>'
                        + '</form>'
                        + '</div>');
        $.post('@Url.Action("GetSkillByUser", "User")', function (res) {
            for (var i = 0; i < res.length; i++) {
                $("#tag-skills").append('<li>' + res[i] + '</li>');
            }
            $("#tag-skills").tagit({
                autocomplete: {
                    delay: 0, minLength: 2, source: function (a, b) {
                        $.post('@Url.Action("GetSkill", "User")?key=' + a.term, function (reval) {
                            b($.grep(reval, function (item) {
                                return true;
                            }));
                        });
                    }
                },
                fieldName: "skills",
                showAutocompleteOnFocus: true,
                singleField: true,
                allowSpaces: true,
                removeConfirmation: true,
            });
        });
        $('#btn-cancel-skill').click(function () {
            $('#div-skill').html(curHTML);
        });
        $('#form-skill').ajaxForm(function (data) {
            if (data.length > 0) {
                $('#div-skill').html('<p>' + data + '</p>');
            }
        });
    });
        function follow(id) {
            $.post('@Url.Action("AddFollow", "User")', { id: id }, function (d) {
                if (d) {
                    window.location = window.location;
                }
            });
        }
        function unfollow(id) {
            $.post('@Url.Action("RemoveFollow", "User")', { id: id }, function (d) {
                if (d) {
                    window.location = window.location;
                }
            });
        }

        function deletedrequest(that) {
            if (confirm("Bạn muốn hủy yêu cầu này?")) {
                var id = $(that).attr('id').substring('request-delete-'.length);
                $.post("@Url.Action("Delete", "Request")", { id: id }, function (data) {
                    if (data.result == true) {
                        var container = $('#request-container-' + id).remove();
                    }
                    else {
                        alert("Không hoàn thành tác vụ.")
                    }
                })
            }
        }
</script>
